<template>
    <view>
        <u-navbar :is-back="false" title="　" :border-bottom="false">
            <view class="u-flex u-row-right" style="width: 100%;"><view class="camera u-flex u-row-center"></view></view>
        </u-navbar>
        <view class="u-flex user-box u-p-l-30 u-p-r-20 u-p-b-30">
            <view class="u-m-r-10"><u-avatar :src="pic" size="140"></u-avatar></view>
            <view class="u-flex-1">
                <view class="u-font-18 u-p-b-20">竞赛报名系统</view>
                <view class="u-font-14 u-tips-color" v-if="!user">未登录</view>
                <view class="u-font-14 u-tips-color" v-if="user">{{ user.name }}</view>
                <view class="u-font-14 u-tips-color" style="color: #DD6161;" v-if="isAdmin">管理员模式</view>
            </view>
            <view class="u-m-l-10 u-p-10"></view>
            <view class="u-m-l-10 u-p-10"></view>
        </view>

        <view class="u-m-t-20" v-if="outbt">
            <u-cell-group><u-cell-item v-if="!isAdmin" icon="star" @click="jumpUsers()" title="个人中心"></u-cell-item></u-cell-group>
        </view>

        <view class="u-m-t-20" v-if="outbt">
            <u-cell-group>
                <u-cell-item v-if="!isAdmin" icon="star" @click="jumpResults()" title="成绩查询"></u-cell-item>
                <u-cell-item v-if="!isAdmin" icon="photo" @click="jumpCompUp()" title="已报竞赛"></u-cell-item>
            </u-cell-group>
        </view>

        <view class="u-m-t-20">
            <u-cell-group>
                <u-cell-item icon="zhihu-circle-fill" @click="jumpKown()" title="问卷调查"></u-cell-item>
                <u-cell-item v-if="isAdmin" icon="list" @click="jumpKownList()" title="问卷结果"></u-cell-item>
            </u-cell-group>
        </view>
        <view class="u-m-t-20" v-if="isAdmin && outbt">
            <u-cell-group>
                <u-cell-item icon="order" @click="addComp()" title="录入竞赛"></u-cell-item>
                <u-cell-item icon="checkbox-mark" @click="addResults()" title="录入成绩"></u-cell-item>
                <u-cell-item icon="list-dot" @click="addNotice()" title="录入公告"></u-cell-item>
            </u-cell-group>
        </view>

<view class="u-m-t-20" v-if="outbt">
            <u-cell-group v-if="outbt"><u-cell-item icon="info" @click="tohelp" title="帮助中心"></u-cell-item></u-cell-group>
        </view>

        <view class="u-m-t-20" v-if="outbt">
            <u-cell-group v-if="outbt"><u-cell-item icon="account" @click="loginout" title="退出登录"></u-cell-item></u-cell-group>
        </view>
        <view class="u-m-t-20" v-if="loginbutton">
            <u-row justify="center">
                <u-col><u-button type="warning" @click="toLogin" :ripple="true">登录</u-button></u-col>
            </u-row>
        </view>
    </view>
</template>

<script>
export default {
    data() {
        return {
            pic: 'https://uviewui.com/common/logo.png',
            show: true,
            user: {},
            loginbutton: true,
            isAdmin: false,
            outbt: false
        }
    },
    onLoad() {
        this.user = uni.getStorageSync('user_info')
    },
    mounted() {
        this.isLogin()
    },
    methods: {
        addNotice() {
            this.$u.route({
                url: 'pages/notice/notice_add'
            })
        },
        isLogin() {
            if (this.user && this.user.name.length > 0) {
                this.loginbutton = false
                this.outbt = true
                if (this.user.admin == 1) {
                    this.isAdmin = true
                }
            } else {
                this.loginbutton = true
                this.outbt = false
                this.isAdmin = false
            }
        },
        addComp() {
            this.$u.route({
                url: 'pages/comp/comp_add'
            })
        },
        addResults() {
            this.$u.route({
                url: 'pages/results/results_add'
            })
        },
        jumpResults() {
            this.$u.route({
                url: 'pages/results/results_list'
            })
        },
        jumpCompUp() {
            this.$u.route({
                url: 'pages/comp/comp_up'
            })
        },
        jumpKown() {
            this.$u.route({
                url: 'pages/wxCenter/konw'
            })
        },
        jumpKownList() {
            this.$u.route({
                url: 'pages/wxCenter/konw_list'
            })
        },
        showComUser() {
            this.$u.route({
                url: 'pages/results/results_user'
            })
        },
        jumpUsers() {
            this.$u.route({
                url: 'pages/wxCenter/user_info'
            })
        },
        loginout() {
            uni.clearStorageSync()
            this.user = undefined
            this.isLogin()
        },
        toLogin() {
            this.$u.route({
                type: 'redirect',
                url: 'pages/login/index'
            })
        },
        tohelp() {
            this.$u.route({
                type: 'redirect',
                url: 'pages/wxCenter/help'
            })
        }
    }
}
</script>

<style lang="scss">
page {
    background-color: #ededed;
}

.camera {
    width: 54px;
    height: 44px;

    &:active {
        background-color: #ededed;
    }
}
.user-box {
    background-color: #fff;
}
</style>
